<template>
  <el-dialog
    :visible.sync="visible"
    :before-close="beforeClose"
    :close-on-click-modal="false"
    append-to-body
    title="附件"
    width="800px"
    top="30px"
  >
    <div style="min-height: 220px">
      <upload-oss
        multiple
        class="form-control-ml"
        ref="upload_oss"
        :file-name="0"
        :dir="uploadURL"
        :file-list="fileList"
        :on-complete="handleImagesComplete"
      >
        <el-button slot="trigger" type="primary" class="btn btn-long" size="small">
          <i class="fa fa-plus"></i>
          选取文件
        </el-button>
      </upload-oss>
    </div>
  </el-dialog>
</template>

<script>
import { arrayToString } from '@vimi/utils-tool'
export default {
  props: {
    queryId: String,
    registerId: { type: String, default: '' },
    visible: Boolean,
  },
  data() {
    return {
      fileList: [],
    }
  },
  computed: {
    uploadURL() {
      return `/attachment/pledge/${this.queryId}`
    },
  },
  created() {},
  methods: {
    submit() {
      if (this.$refs.upload_oss) {
        this.$refs.upload_oss.submit()
      } else {
        this.$emit('save', '')
      }
    },
    beforeClose() {
      this.$emit('update:visible', false)
    },
    clearImages() {
      this.fileList = []
    },
    handleImagesComplete(images = []) {
      const imgStr = arrayToString(images.map(item => item.url))
      this.$emit('save', imgStr)
    },
  },
}
</script>
<style lang="scss" scoped></style>
